/*
 * @Author: liyongxuan
 * @Date: 2018-1-10 10:37:42
 * @Last Modified by: liyongxuan
 * @Last Modified time: 2018-1-10 10:37:42
 * @description 审批流程组件
 */
<template>
  <div class="ca-box ca-p-22 ca-m-t-15">
      <div class="ca-title">
          <el-row>
              <el-col :span="16">
                <span class="ca-ti-1">{{title}}</span>
                <span>(任何一步审批不通过都需要重新开始哦)</span>
              </el-col>
              <el-col :span="4">
                <el-button v-if="processBtnFlag" type="primary" @click="openDialogFormVisible" :disabled="disableStart==1||disableStart==0">＋发起审批</el-button>
              </el-col>
              <el-col :span="4">
                <el-select placeholder="发起审批时间" v-model="approvalTime" @change="getItemApprovalEntity">
                    <el-option v-for="(item,index) in approvalTimeList" :key="index" :label="$moment(item).format('YYYY-MM-DD HH:mm:ss')" :value="item">
                    </el-option>
                </el-select>
              </el-col>
          </el-row>
      </div>
      <div class="fw_box fw_box_02 ca-m-t-15" v-if="approvals!=[]">
            <div class="ca-review ca-file-self">
                <ul>
                    <li v-for="(item,i) in approvals" :key="i">
                        <div class="ca-review-ico">{{item.name}}</div>
                        <div class="ca-review-text">
                            <el-row class="ca-m-t-15" v-if="item.status==2">
                                <el-row>
                                    <el-col :span="2" class="ca-span-title">
                                        操作人：
                                    </el-col>
                                    <el-col :span="4">
                                        {{item.itemApprovalUserEntities[0].userId|getDepartmentById('userEntityList')}}
                                    </el-col>
                                    <el-col :span="2" class="ca-span-title">
                                        审批结果：
                                    </el-col>
                                    <el-col :span="2" :style="{color:getStyleByState(item.itemApprovalUserEntities[0].status)}">
                                        {{item.itemApprovalUserEntities[0].status==1?'通过':'不通过'}}
                                    </el-col>
                                    <el-col :span="2" class="ca-span-title">
                                        时间：
                                    </el-col>
                                    <el-col :span="4">
                                        {{$moment(item.itemApprovalUserEntities[0].updateTime).format('YYYY-MM-DD hh:mm:ss A')}}
                                    </el-col>
                                </el-row>
                                <el-row>
                                    <el-col :span="2" class="ca-span-title">
                                        意见：
                                    </el-col>
                                    <el-col :span="22">
                                        {{item.itemApprovalUserEntities[0].opinion}}
                                    </el-col>
                                </el-row>
                                <!-- 文件列表 -->
                                <el-row class="ca-file-ul">
                                    <el-col :span="2" class="ca-span-title">
                                        附件：
                                    </el-col>
                                    <el-col :span="22">
                                        <el-row class="ca-file-row ca-m-t-10" v-for="(file, detailIndex) in item.filesVoList" :key="detailIndex">
                                            <el-col :span="1">
                                                <tz-icon-file-type class="ca-m-r-5" :fileType="file.fileName"></tz-icon-file-type>
                                            </el-col>
                                            <el-col :span="15">
                                                <div class="ca-text-over-flow-ellipsis ca-pointer"
                                                    @click="previewFileCheck(file.id, file.fileName)">
                                                    <span class="ca-font-size-16 ca-pointer">{{file.fileName}}</span>
                                                </div>
                                            </el-col>
                                            <el-col :span="6" class="ca-pull-right ca-align-right">
                                                <a class="ca-download ca-m-r-10" @click="downloadFile(file.id)"></a>
                                                <el-button class="ca-table-btn" @click="deleteFileItem(file,detailIndex,i)">
                                                    <i class="fa fa-times"></i>
                                                </el-button>
                                            </el-col>
                                        </el-row>
                                    </el-col>
                                </el-row>
                            </el-row>
                            <el-row class="ca-m-t-15" v-else-if="item.status==1">
                                <template v-if="item.hasPower">
                                    <el-row>
                                        <el-col :span="2" class="ca-span-title">
                                            意见：
                                        </el-col>
                                        <el-col :span="22">
                                            <el-input id="item_info" type="textarea" :rows="2" :maxlength="3000" v-model="opinion"></el-input>
                                        </el-col>
                                    </el-row>
                                    <el-row class="ca-m-t-10">
                                        <el-col :span="2">附件：</el-col>
                                        <el-col :span="22">
                                            <csUpload
                                                :fileType="fileType"
                                                :businessId="itemId"
                                                :limit="1"
                                                :uploadTip="'仅支持单文件上传'"
                                                :multiple="false"
                                                :getFileUploadedReturnData="getFileUploadedReturnDataFun"
                                            ></csUpload>
                                            <span v-for="(item,index) in fileList" :key="index">{{ item.fileName }}&nbsp;&nbsp;</span>
                                        </el-col>
                                        <!-- <div v-for="(item,index) in fileList" :key="index">
                                            {{ item.fileName }}
                                        </div> -->
                                    </el-row>
                                    <el-row class="ca-m-t-15">
                                        <el-col :offset="19" :span="2">
                                            <el-button type="success" @click="putItemApprovalEntity(1,item.id)">通过</el-button>
                                        </el-col>
                                        <el-col :span="2" :push="1">
                                            <el-button type="danger" @click="putItemApprovalEntity(2,item.id)">不通过</el-button>
                                        </el-col>
                                    </el-row>
                                </template>
                                <template v-else>
                                    （正在审批）
                                </template>
                            </el-row>
                            <el-row class="ca-m-t-15" v-else-if="item.status==0">
                                <el-col :span="24" class="ca-c-darkgray">
                                    （尚未进行到该步骤）
                                </el-col>
                            </el-row>
                        </div>
                        <div class="clear"></div>
                    </li>
                </ul>
            </div>
        </div>
      <el-dialog title="发起审批" :visible.sync="dialogFormVisible">
            <el-form>
                <el-form-item label="备注：">
                    <el-input id="item_info" type="textarea" v-model="opinion" :rows="3" placeholder="不超过3000字" :maxlength="3000"></el-input>
                </el-form-item>
                <el-form-item label="附件：">
                    <div class="ca-inline-block ca-m-r-10 ">
                        <csUpload
                            :fileType="fileType"
                            :businessId="itemId"
                            :limit="1"
                            :uploadTip="'仅支持单文件上传'"
                            :multiple="false"
                            :getFileUploadedReturnData="getFileUploadedReturnDataFun"
                        ></csUpload>
                    </div>
                    <div v-for="(item,index) in fileList" :key="index">
                        {{ item.fileName }}
                    </div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="startExaminationApproval()">确 定</el-button>
            </div>
        </el-dialog>
  </div>
</template>

<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import { addRemind,isNoAuth } from '__service/utils';
    import mined from '__components/file-list/mixin';
    export default {
        mixins: [mined],
        data() {
            return {
                processBtnFlag: true, // 发起审批按钮是否可见
                userId: this.$store.state.user.id,//用户id
                disableStart: 2,//发起审批按钮
                dialogFormVisible: false,//弹窗flag
                approvals: [],//审批列表
                approvalTimeList: [],//审批历史时间列表
                approvalTime: null,//发起审批时间
                opinion: '',//意见
                approvalData: {},//审批数据
                roles: this.$store.state.user.roles,
                fileList: [],//上传文件详情
                fileIds: [],//上传文件 id
            }
        },
        props: {
            title: {
                type: String,
                default: function () {
                    return ''
                }
            },
            itemId: {
                type: String,
                default: function () {
                    return ''
                }
            },
            fileType: {
                type: String,
                default: function () {
                    return ''
                }
            },
            // 审批类型
            type: {
                type: Number,
                default: function () {
                    return null
                }
            },
            // 添加红点的tabindex
            dataTabIndex: {
                type: Number,
                default: function () {
                    return null
                }
            },
            // 添加小红点类型
            dataType: {
                type: Number,
                default: function () {
                    return 4
                }
            }
        },
        mounted() {
            isNoAuth('')
            this.hasPowerCreateApproval()
            this.getItemApprovalEntityTime()
            this.getItemApprovalEntity(0)
        },
        methods: {
            // 查询是否有权限发起审批
            async hasPowerCreateApproval() {
                const {resCode,data} = await apiHttp(api.GET_HAS_POWER_CREATE_APPROVAL,{dataId: this.itemId,processType: this.type})
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.processBtnFlag = data
                }
            },
            // 文件成功返回的数据
            getFileUploadedReturnDataFun(data) {
                this.fileIds = [data[0].id]
                this.fileList = [data[0]]
            },
            // 打开发起审批对话框
            openDialogFormVisible() {
                this.dialogFormVisible = true
                this.opinion = ''
                this.fileList = []//初始化上传文件详情
                this.fileIds = []//初始化上传文件 id
            },
            // 发起审批
            async startExaminationApproval() {
                let query = {
                    fileIds: this.fileIds,
                    itemId: this.itemId,
                    opinion: this.opinion,
                    type: this.type//1：项目协议审批、2：基金立项审批、3：基金打款审批、4：基金重大事项审批
                }
                const {resCode,resMsg} = await apiHttp(api.POST_ITEM_APPROVAL_ENTITY,query)
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.addRed()
                    this.getItemApprovalEntity()
                    this.opinion = ''
                    this.dialogFormVisible = false
                    this.fileList = []//初始化上传文件详情
                    this.fileIds = []//初始化上传文件 id
                } else {
                    this.$message({message: resMsg,type: 'error',center: true})
                }
            },
            // 审批
            async putItemApprovalEntity(status,id) {
                let query = {
                    fileIds: this.fileIds,
                    id,
                    itemId: this.itemId,
                    opinion: this.opinion,
                    status,
                    type: this.type
                }
                const {resCode,resMsg} = await apiHttp(api.PUT_ITEM_APPROVAL_ENTITY,query)
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.addRed()
                    this.opinion = ''
                    this.getItemApprovalEntity(0)
                    this.getItemApprovalEntityTime()
                    this.hasPowerCreateApproval()
                    this.fileList = []//初始化上传文件详情
                    this.fileIds = []//初始化上传文件 id
                } else {
                    this.$message({message: resMsg,type: 'error',center: true})
                }
            },
            // 查询审批列表
            async getItemApprovalEntity(val) {
                this.getItemApprovalEntityTime()
                let query = {
                    itemId: this.itemId,
                    type: this.type,
                    createDate: val
                }
                const {resCode,data} = await apiHttp(api.GET_ITEM_APPROVAL_ENTITY,query)
                if (resCode === STATUS_HTTP_SUCCESS) {
                    if (data.length > 0) {
                        this.approvals = data[0].itemApprovalRoleVos
                        if (this.approvals !== null && this.approvals.length > 0) {
                            this.approvals.map(u => {
                                this.roles.map(i => {
                                    if (u.roleId === i.id) {
                                        u.name = i.name
                                    }
                                })
                            })
                        }
                        this.disableStart = data[0].status
                    }
                }
            },
            // 查询审批历史时间
            async getItemApprovalEntityTime() {
                const {resCode,data} = await apiHttp(api.GET_ITEM_APPROVAL_ENTITY_TIME,{itemId: this.itemId,type: this.type})
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.approvalTimeList = data
                }
            },
            //   审批结果字体颜色
            getStyleByState(state) {
                if (state === 1) {
                    return '#0ac50a';
                } else {
                    return 'red';
                }
            },
            // 添加小红点
            async addRed() {
                await addRemind({
                    dataId: this.itemId || '', // 业务id
                    dataTab: this.dataTabIndex, // tab页顺序 head 也为0
                    dataType: this.dataType, // 1拟投资项目,2已投资项目,3母基金,4拟设立基金,5已设立基金,6客户,7潜在项目
                });
                // 根据第三方组件来调用 父组件中定义的方法 重新获取小红点
                this.$root.Dot.$emit('getDotList');
            },
            deleteFileItem(file,index,i) {
                this.$confirm('确认删除此文件?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    showClose: false
                }).then(async () => {
                    apiHttp(api.DELETE_FILE,{id: file.id}).then( ret=>{
                        if (ret.resCode === STATUS_HTTP_SUCCESS) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                                center: true
                            });
                            this.approvals[i].filesVoList.splice(index, 1);
                        }
                    })
                })
            },
        },
        components: {
            csUpload: require('../upload-btn')
        }
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.ca-ti-1{
    font-size: 20px
}
</style>
